import { Carousel } from './carousel';

class Fade extends Carousel {
  constructor($, options) {
    super($, options);
    // === 配置参数
    // 下标处理最大值
    this.MAXLEN = this.oCarItems.length - 1;

    this.init();
  }

  init() {
    this.autoCarousel();
    this.bindClickEvent();
  }

  carClick(event) {
    // 兼容处理
    const e = event || window.event;
    const target = e.target || e.srcElement;
    const className = target.className.split(' ')[0];
    let index;
    switch (className) {
      case 'car-button':
        // 左右按钮
        index = target.getAttribute('data-type') === 'prev' ? this.curIndex - 1 : this.curIndex + 1;
        this.pageChange(index);
        break;
      case 'indicator-btn':
        // 小圆点点击
        index = $(target).index();
        this.pageChange(index);
        break;
      default:
        break;
    }
  }

  // 开始轮播
  run() {
    this.pageChange(this.curIndex + 1);
  }

  // 页面根据下标更新索引值以及页面展示图片
  pageChange(index) {
    this._setIndex(index);
    this.oCarItems.eq(this.curIndex).addClass('active').siblings('li').removeClass('active');
    this.oCarIndicators.eq(this.curIndex).addClass('active').siblings('i').removeClass('active');
  }

  // 更新当前索引
  _setIndex(index) {
    // 下标越界处理
    if (index < this.MINLEN) {
      // 自动到最后一张即可
      index = this.MAXLEN;
    } else if (index > this.MAXLEN) {
      index = this.MINLEN;
    }
    this.curIndex = index;
  }
};

export { Fade };